// 等待DOM加载完成
document.addEventListener('DOMContentLoaded', () => {
    // 检查必要的DOM元素是否存在
    function checkRequiredElements() {
        const elements = {
            carousel: document.querySelector('.carousel-wrapper'),
            slides: document.querySelectorAll('.carousel-slide'),
            prevButton: document.querySelector('.prev'),
            nextButton: document.querySelector('.next'),
            indicators: document.querySelectorAll('.indicator'),
            carouselContainer: document.querySelector('.carousel-container')
        };
        
        // 检查轮播图相关元素
        if (!elements.carousel || !elements.slides.length || !elements.carouselContainer) {
            console.error('轮播图必要元素缺失');
            return null;
        }
        
        return elements;
    }
    
    // 获取必要的DOM元素
    const elements = checkRequiredElements();
    if (!elements) return;
    
    const { carousel, slides, prevButton, nextButton, indicators, carouselContainer } = elements;
    let currentSlide = 0;
    const slideCount = slides.length;
    let isAutoPlaying = true;

    // 轮播图自动播放定时器
    let autoPlayTimer;
    
    // 初始化轮播图位置
    updateCarousel(false);

    // 更新轮播图位置
    function updateCarousel(smooth = true) {
        carousel.style.transition = smooth ? 'transform 0.5s ease-in-out' : 'none';
        carousel.style.transform = `translateX(-${currentSlide * 100}%)`;
        // 更新指示器状态
        indicators.forEach((indicator, index) => {
            indicator.classList.toggle('active', index === currentSlide);
        });
    }

    // 切换到下一张图片
    function nextSlide() {
        currentSlide = (currentSlide + 1) % slideCount;
        updateCarousel();
        // 重置自动播放计时器
        if (isAutoPlaying) {
            stopAutoPlay();
            startAutoPlay();
        }
    }

    // 切换到上一张图片
    function prevSlide() {
        currentSlide = (currentSlide - 1 + slideCount) % slideCount;
        updateCarousel();
        // 重置自动播放计时器
        if (isAutoPlaying) {
            stopAutoPlay();
            startAutoPlay();
        }
    }

    // 设置自动播放
    function startAutoPlay() {
        autoPlayTimer = setInterval(nextSlide, 3000);
    }

    // 停止自动播放
    function stopAutoPlay() {
        clearInterval(autoPlayTimer);
    }

    // 使用事件委托优化按钮事件
    document.addEventListener('click', (e) => {
        if (e.target === prevButton) {
            prevSlide();
        } else if (e.target === nextButton) {
            nextSlide();
        } else if (e.target.classList.contains('indicator')) {
            const index = Array.from(indicators).indexOf(e.target);
            if (index !== -1) {
                currentSlide = index;
                updateCarousel();
                if (isAutoPlaying) {
                    stopAutoPlay();
                    startAutoPlay();
                }
            }
        }
    });

    // 鼠标悬停控制
    carouselContainer.addEventListener('mouseenter', () => {
        if (isAutoPlaying) stopAutoPlay();
    });

    carouselContainer.addEventListener('mouseleave', () => {
        if (isAutoPlaying) startAutoPlay();
    });

    // 触摸事件支持
    let touchStartX = 0;
    let touchEndX = 0;

    carouselContainer.addEventListener('touchstart', (e) => {
        touchStartX = e.touches[0].clientX;
        stopAutoPlay();
    });

    carouselContainer.addEventListener('touchend', (e) => {
        touchEndX = e.changedTouches[0].clientX;
        const difference = touchStartX - touchEndX;

        if (Math.abs(difference) > 50) {
            if (difference > 0) {
                nextSlide();
            } else {
                prevSlide();
            }
        }

        if (isAutoPlaying) startAutoPlay();
    });

    // 启动自动播放
    startAutoPlay();

    // 模态框相关元素
    const modal = document.getElementById('imageModal');
    if (!modal) return;
    
    const modalImg = modal.querySelector('.modal-content');
    const closeButton = modal.querySelector('.close-modal');
    
    if (!modalImg || !closeButton) {
        console.error('模态框必要元素缺失');
        return;
    }

    // 点击轮播图打开模态框
    slides.forEach(slide => {
        const img = slide.querySelector('img');
        img.addEventListener('click', () => {
            modalImg.src = img.src;
            modal.classList.add('show');
        });
    });

    // 点击关闭按钮或模态框外部关闭模态框
    modal.addEventListener('click', (e) => {
        if (e.target === modal || e.target === closeButton) {
            modal.classList.remove('show');
        }
    });
});